<template>
  <div class="app-container">
    <div class="btnCss">
      <el-tabs v-model="active" @tab-click="handleClick">
        <el-tab-pane label="待办任务" name="first">
          <cwTodo v-if="active == 'first'"></cwTodo>
        </el-tab-pane>
        <el-tab-pane label="已办任务" name="second">
          <cwFinished v-if="active == 'second'"></cwFinished>
        </el-tab-pane>
        <el-tab-pane  v-if="checkPermi(['workflow:Cloudwhitelist:manage'])"  label="云防护策略白名单申请管理" name="third">
          <cwGather v-if="active == 'third'"></cwGather>
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>

<script>
import cwFinished from './components/cwFinished.vue';
import cwGather from './components/cwGather.vue';
import cwTodo from './components/cwTodo.vue';


export default {
    name:'Cloudwhitelist',
    components: {
      cwFinished,
      cwGather,
      cwTodo
    },
  data() {
    return {
      active:'first'
    };
    },
    mounted() {
        // 获取按钮元素数组中第一个.click()
  },
  methods: {
    
    handleClick(tab, event) {
      this.active = tab.name
    }
  }
};
</script>
